import type { ExtractPropTypes, PropType } from 'vue';
import type Image from './image.vue';

export const imageProps = {
	bgc: {
		type: String as PropType<string>,
		default: 'transparent'
	},
	width: {
		type: [Number, String] as PropType<number | string>,
		default: '100%'
	},
	height: {
		type: [Number, String] as PropType<number | string>,
		default: '100%'
	},
	scalable: {
		type: Boolean as PropType<boolean>,
		default: false
	},
	minScale: {
		type: Number as PropType<number>,
		default: -8
	},
	maxScale: {
		type: Number as PropType<number>,
		default: 100
	},
	src: {
		type: String as PropType<string>,
		default: '',
		required: true
	},
	title: {
		type: String as PropType<string>,
		default: ''
	},
	alt: {
		type: String as PropType<string>,
		default: ''
	},
	fit: {
		type: String as PropType<'fill' | 'contain' | 'cover' | 'none' | 'scale-down'>,
		default: 'contain'
	},
	error: {
		type: String as PropType<string>,
		default: ''
	},
	onScale: {
		type: Function as PropType<(scale: number) => void>,
		default: () => {}
	}
} as const;

export type ImageProps = ExtractPropTypes<typeof imageProps>;
export type ImageInstance = InstanceType<typeof Image>;
